<template>
  <tr>
    <td class="checkbox">
      <input class="check-one check" v-model="ischeck" type="checkbox" />
    </td>
    <td class="goods">
        <!-- <img :src="require('@/assets/logo.png')" alt="" /> -->
      <img :src="require('@/assets/'+item.imgurl)" alt="" /><span>{{ item.pname }}</span>
    </td>
    <td class="price">{{ item.price }}</td>
    <td class="count">
      <span class="reduce" @click="reduceNum(k, item)">{{
        item.num > 1 ? "-" : ""
      }}</span
      ><input class="count-input" type="text" :value="item.num" /><span
        class="add"
        @click="addnum(k)"
        >+</span
      >
    </td>
    <td class="subtotal">{{ item.price * item.num }}</td>
    <td class="operation"><span @click="del(k)" class="delete">删除</span></td>
  </tr>
</template>

<script>
export default {
  props: ["item", "k"],
  template: "#trcom",
  data: function () {
    return {
      ischeck: this.item.ischeck,
    };
  },
  watch: {
    "item.ischeck": function (newvalue) {
      // console.log("??",newvalue)
      this.ischeck = newvalue;
    },
    // 双绑 会更改数据 ，数据会变化 ，监听数据的变化 ，获取最新数据
    ischeck: function (newvalue) {
      console.log(newvalue);
      this.$emit("checkproduct", { k: this.k, ischeck: newvalue });
    },
  },
  methods: {
    addnum(k) {
      console.log(k);
      this.$emit("addnum", k);
    },
    reduceNum(k, item) {
      // console.log(item);
      if (item.num > 1) {
        this.$emit("reducenum", k);
      }
    },
    del(k) {
      this.$emit("del", k);
    },
    checkproduct(k) {
      // console.log(item)
      // 改成watch
      setTimeout(() => {
        // console.log(this.ischeck)
        this.$emit("checkproduct", { k, ischeck: this.ischeck });
      });
      // this.$emit("checkproduct",{k,ischeck:item.ischeck})
    },
  },
};
</script>

<style>
</style>